$(function () {
    /*优化代码点1,选择器选择的dom对象统一用变量抽取出来*/
    var empDatagrid = $("#emp_datagrid");
    var editAndDelBtn = $("#emp_datagrid_edit,#emp_datagrid_del");
    var empDialog = $("#emp_dialog");
    var empForm = $("#emp_form");
    var keyWord = $("[name='keyWord']");
    var empFormId = $("#emp_form [name='id']");

    empDatagrid.datagrid({
        fit: true,
        rownumbers: true,
        pagination: true,
        fitColumns: true,
        toolbar: "#emp_datagrid_tb",
        url: '/employee_list',
        pageList: [1, 10, 20, 50],
        singleSelect: true,
        onClickRow: function (rowIndex, rowData) {
            if (rowData.state) {
                editAndDelBtn.linkbutton("enable");
            } else {
                //按钮禁用 通过id选择器找到dom,然后找到dom下的a标签的第二个$("#emp_datagrid_tb a").eq(1).linkbutton("disable");
                editAndDelBtn.linkbutton("disable");
            }
        },
        columns: [[
            {field: "username", title: "用户名", width: 1, align: 'center'},
            {field: "realname", title: "真实姓名", width: 1, align: 'center'},
            {field: "tel", title: "电话", width: 1, align: 'center'},
            {field: "email", title: "邮箱", width: 1, align: 'center'},
            {field: "dept", title: "部门", width: 1, align: 'center', formatter: deptFormatter},
            {field: "inputtime", title: "入职时间", width: 1, align: 'center'},
            {field: "state", title: "状态", width: 1, align: 'center', formatter: stateFormatter},
            {field: "admin", title: "是否超级管理员", width: 1, align: 'center', formatter: adminFormatter}
        ]]
    });
    empDialog.dialog({
        width: 400,
        height: 550,
        buttons: "#emp_dialog_bt",
        closed: true
    });
    /*优化代码点2 方法统一用这个对象来管理*/
    var cmdObj = {
        add: function () {
            empDialog.dialog("open");
            empDialog.dialog("setTitle", "新增");
            empForm.form("clear");
        },
        save: function () {
            var idVal = empFormId.val();
            var url;
            if (idVal) {
                url = "/employee_update";
            } else {
                url = "/employee_save";
            }
            empForm.form("submit", {
                url: url,
                onSubmit:function(param){
                    var options = $("#roles").combo("getValues");
                    for (let i = 0; i < options.length; i++) {
                        param['roles['+i+'].id'] = options[i];
                    }
                },
                success: function (data) {
                    data = $.parseJSON(data);
                    if (data.success) {
                        //关闭对话框
                        empDialog.dialog("close");
                        //刷新数据表格
                        empDatagrid.datagrid("load");
                    } else {
                        $.messager.alert("温馨提示" , data.msg, "info");
                    }

                }
            })
        },
        edit: function () {
            //拿到选定的数据
            var rowData = empDatagrid.datagrid('getSelected');
            if (rowData) {
                empDialog.dialog("open");
                empDialog.dialog("setTitle", "编辑");
                empForm.form("clear");
                //特殊数据的处理-转换一下属性
                if (rowData.dept) {
                    rowData["dept.id"] = rowData.dept.id;
                }
                /*让前台回显1，发送ajax请求到后台 2 把值给combobox*/
                var result;
                $.ajax({
                    url: "/queryRoleIdByEmployeeId?eid="+rowData.id,
                    type: "GET",
                    dataType: "json",
                    async:false,
                    success: function(data) {
                        result=data;
                    }
                });
                $("#roles").combobox('setValues', result);
                empForm.form("load", rowData);//基于同名匹配原则
            } else {
                $.messager.alert("温馨提示", "请选择一条需要编辑的数据", "info")
            }
        },
        delEmployee: function () {
            //拿到选定的数据
            var rowData = empDatagrid.datagrid('getSelected');
            if (rowData) {
                //再次确认
                $.messager.confirm("温馨提示", "您确定该员工要离职", function (yes) {
                    if (yes) {
                        $.get("/employee_delete?id=" + rowData.id, function (data) {
                            if (data.success) {
                                $.messager.alert("温馨提示", data.msg, "info", function () {
                                    //刷新数据表格
                                    empDatagrid.datagrid("reload");
                                })
                            } else {
                                $.messager.alert("温馨提示", data.msg, "info")
                            }
                        }, "json")
                    }
                })
                //向后台发送ajax请求

                //根据请求的结果进行提示

            } else {
                $.messager.alert("温馨提示", "请选择一条需要删除的数据", "info")
            }
        },
        reload: function () {
            empDatagrid.datagrid("reload");
        },

        cancel: function () {
            empDialog.dialog("close");
        },

        employeeSerach: function () {
            var value = keyWord.val();
            //重新加载数据,并进行ajax传参
            empDatagrid.datagrid("load", {
                keyWord: value
            });
        }
    };
    /*对有data-cmd这个属性的a标签进行监听*/
    $("a[data-cmd]").on("click",function () {
        //<a data-cmd="save">
        var cmd = $(this).data("cmd");//save
        //如果有这个值,就调取对应的方法
        if(cmd){
            cmdObj[cmd]();//为什么要有括号呢
        }

    });
});

function deptFormatter(value, record, index) {
    return value ? value.name : "";
}

function stateFormatter(value, record, index) {
    return value ? "<font color='green'>正常</font>" : "<font color='red'>离职</font>";
}

function adminFormatter(value, record, index) {
    return value ? "<font color='red'>管理员</font>" : "普通用户";
}
